<template>
	<ReturnPage title="返回" :on-back="onBack"></ReturnPage>
	<view class="panel-box">
		<FormPanel title="创建赛程" description="为赛事创建新的赛程安排" :btns="btns">
			<view class="form">
				<slot></slot>
			</view>
		</FormPanel>
	</view>
</template>

<script setup>
import ReturnPage from '@/components/ReturnPage.vue'
import FormPanel from '@/components/FormPanel.vue'
import { computed } from 'vue'

const props = defineProps(['loading', 'goBack', 'createSchedule'])
const { goBack, createSchedule } = props

const onBack = () => {
	uni.navigateBack()
}

const btns = computed(() => [
	{
		text:  '取消',
		icon: '/src/static/btn_blue.png',
		color: '#FFFFFF',
		click() {
			goBack()
		}
	},
	{
		text: props.loading ? '创建中...' : '创建赛程',
		icon: '/src/static/btn_green.png',
		color: '#005918',
		disabled: props.loading,
		click() {
			createSchedule()
		}
	}
	
])

const formItems = [
	{
		label: '赛程名称',
		key: 'name',
		type: 'input'
	},
	{
		label: '关联赛事',
		key: ''
	}
]

</script>

<style scoped lang="scss">
.panel-box {
	width: 100vw;
	height: calc(100vh - 60rpx);
	padding: 0 160rpx;
	box-sizing: border-box;
}
.form {
	width: 100%;
	height: 100%;
	overflow: auto;
	padding: 12rpx 18rpx 0 18rpx;
	box-sizing: border-box;
	background-color: #F0F0E4;
	border-radius: 6rpx;
	&:deep(.form-item) {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 14rpx;
		.form-label {
			width: 90rpx;
			font-family: Source Han Sans CN, Source Han Sans CN;
			font-weight: 400;
			font-size: 13rpx;
			color: #2B2B2B;
			line-height: 18rpx;
			text-align: right;
			flex-shrink: 0;
		}
		.required::after {
			content: "*";
			display: inline-block;
			color: orangered;
			font-size: 10rpx;
			position: relative;
			top: -2rpx;
		}
		.form-input, .form-picker {
			flex-grow: 1;
			margin-left: 6rpx;
			background-color: #DADADA;
			border-radius: 4rpx;
			height: 26rpx;
			line-height: 26rpx;
			padding: 0 10rpx;
			font-size: 13rpx;
			color: #000000;
		}
		.placeholder {
			color: #969696;
		}
		
	}
}
</style>